﻿/*! qik_animate.css | v171121.2009 Copyright QikCss 2010 - 2018 | MIT License | http://QikCss.com  */
/*  To customize you project it is recommend you override only the customized elements/atributes in a seperate Qik_Theme css found at http://QikCss.com */

/*======================================================   ANIMATION / HOVER / TRANSFORM / TRANSITION   ================================================*/

/*#region ACCORDION */

.accordion > input{
	display: none;
    cursor: pointer;
}

.accordion > input:checked + label {
	background: #999;
	color: red;
}

.accordion > input[type = checkbox]:checked + label:hover:before {
        content: " \25BC  ";
        color: green;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: left;
}

.accordion > input[type = radio]:checked + label:hover:before {
        content: " \25BC  ";
        color: green;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: left;
}

.accordion > article > p {
    padding: 1.1em 2em;
}


.accordion:not(param:focus) {
    

}


/*#region -  row  - */
/*Row*/
.row.accordion > label {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    cursor: pointer;
    color: #ccc;
    padding: .8em;
    background: rgb(125,126,125);
    background: linear-gradient(to top,  rgba(125,126,125,1) 0, rgba(141,141,141,1) 100%); 
    border-bottom: 2px double #000;
}

.row.accordion > label:hover,
.row.accordion > input:checked + label:hover {
    background: #ddd;
    color: #666;
    border-bottom: 2px double #bbb;
}

.row.accordion > label:hover:after,
.row.accordion > input:checked + label:hover:after {
        content: " \25B2  ";
        color: red;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: right;
    /*content: '';
    position: relative;
    display: inline-block;
    width: 25%;
    height: 24px;
    right: 13px;
    top: 7px;
    background: url('Images/Icons/arrowDown.png') no-repeat center center;*/
}

    /*.hvrXpndr > :first-child:before {
        content: " \25BC  ";
        color: green;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: left;
    }
    .hvrXpndr:hover > :first-child:before {
        content: " \25B2  ";
        color: red;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: right;
    }*/



.row.accordion > input[type = radio] ~ article {
    height: 100%;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 300ms  ease;
    -moz-transition: max-height 300ms  ease;
    -ms-transition: max-height 300ms  ease;
    -o-transition: max-height 300ms  ease;
    transition: max-height 300ms  ease;
}

.row.accordion > input[type = checkbox]  ~ article {
    height: 100%;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 300ms ease;
    -moz-transition: max-height 300ms ease;
    -ms-transition: max-height 300ms ease;
    -o-transition: max-height 300ms ease;
    transition: max-height 300ms ease;
}



.row.accordion > input[type = checkbox]:checked ~ article, .row.accordion > input[type = radio]:checked ~ article {
    max-height: 1000px;
    -webkit-transition: max-height 1s ease;
    -moz-transition: max-height 1s ease;
    -ms-transition: max-height 1s ease;
    -o-transition: max-height 1s ease;
    transition: max-height 1s ease;
}



/*#endregion */


/*#region -  col  - */
/*Column*/

/*.col.accordion {
    width: auto;
    border: 1px solid blue;
}


.col.accordion > div.col > label {
    display: block;
    position: relative;
    width: auto;
    cursor: pointer;
    color: #ccc;
    padding: .8em;
    background: rgb(125,126,125);
    background: linear-gradient(to top,  rgba(125,126,125,1) 0, rgba(141,141,141,1) 100%); 
    border-bottom: 2px double #000;
    border: 1px solid red;
}

.col.accordion > label:hover,
.col.accordion > input:checked + label:hover {
    background: #ddd;
    color: #666;
    border-bottom: 2px double #bbb;
}

.col.accordion > label:hover:after,
.col.accordion > input:checked + label:hover:after {
    content: '';
    position: relative;
    display: inline-block;
    width: 25%;
    height: 24px;
    right: 13px;
    top: 7px;
    background: url('Images/Icons/arrowDown.png') no-repeat center center;
}



.col.accordion > div.col:nth-child(2) {
    display: inline-block;
    position: relative;
    width: 0px;
    xwidth: 0;
    overflow: hidden;
    border: 1px solid yellow;
}


.col.accordion > div.col:nth-child(1):checked ~ div.col:nth-child(2){
    width: 300px;
}*/



/*#endregion */



/*#endregion */

/*#region -  ANIMATION  - */
/* ==========  Animation Effects ========== */

/*#region -  EASE  -  */
/* ====================  Ease  ==================== */
.ease0100, .ease0100 img {
    -webkit-transition: all 100ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 100ms ease;
    -o-transition: all 100ms ease;
    transition: all 100ms ease;
}
.ease0200, .ease0200 img {
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.ease, .ease img,
.ease0300, .ease0300 img {
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}
.ease0400, .ease0400 img {
    -moz-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    -webkit-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    transition: all 400ms ease;
}
.ease0500, .ease0500 img {
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
.ease0600, .ease0600 img {
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}
.ease0700, .ease0700 img {
    -webkit-transition: all 700ms ease;
    -moz-transition: all 700ms ease;
    -ms-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    transition: all 700ms ease;
}
.ease0800, .ease0800 img {
    -webkit-transition: all 800ms ease;
    -moz-transition: all 800ms ease;
    -ms-transition: all 800ms ease;
    -o-transition: all 800ms ease;
    transition: all 800ms ease;
}
.ease0900, .ease0900 img {
    -webkit-transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
    transition: all 900ms ease;
}
.ease1000, .ease1000 img {
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.ease1500, .ease1500 img {
    -moz-transition: all 1.5s ease;
    -o-transition: all 1.5s ease;
    -webkit-transition: all 1.5s ease;
    -ms-transition: all 1.5s ease;
    transition: all 1.5s ease;
}
.ease2000, .ease2000 img {
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    -webkit-transition: all 2s ease;
    -ms-transition: all 2s ease;
    transition: all 2s ease;
}
.ease2500, .ease2500 img {
    -moz-transition: all 2.5s ease;
    -o-transition: all 2.5s ease;
    -webkit-transition: all 2.5s ease;
    -ms-transition: all 2.5s ease;
    transition: all 2.5s ease;
}
/*#endregion ease*/

/*#region -  EXPAND  - */
.expndDwn {
    margin-top: -800px;
    max-width: 480px;
    -moz-transition: 500ms all;
    -o-transition: 500ms all;
    -webkit-transition: 500ms all;
    -ms-transition: 500ms all;
    transition: 500ms all;
}
    .expndDwn:target{
        margin-top: 30px;
        -moz-transition: 500ms all;
        -o-transition: 500ms all;
        -webkit-transition: 500ms all;
        -ms-transition: 500ms all;
        transition: 500ms all;
    }
.expndLft {
    margin-right: -202%;
    margin-left: 102%;
    position: fixed;
    background-color: #999;
    text-align: center;
    -moz-transition: 500ms all;
    -o-transition: 500ms all;
    -webkit-transition: 500ms all;
    -ms-transition: 500ms all;
    transition: 500ms all;
    z-index: 1000;
}
    .expndLft:target {
        max-width: 480px;
        margin-right: 0;
        margin-left: 0;
        -moz-transition: 500ms all;
        -o-transition: 500ms all;
        -webkit-transition: 500ms all;
        -ms-transition: 500ms all;
        transition: 500ms all;
    }
.expndRt {
    max-width: 480px;
    margin-left: -202%;
    margin-right: 102%;
    position: fixed;
    background-color: #999;
    -moz-transition: 500ms all;
    -o-transition: 500ms all;
    -webkit-transition: 500ms all;
    -ms-transition: 500ms all;
    transition: 500ms all;
    z-index: 1000;
}
    .expndRt:target {
        margin-left: 0;
        margin-right: 0;
        -moz-transition: 500ms all;
        -o-transition: 500ms all;
        -webkit-transition: 500ms all;
        -ms-transition: 500ms all;
        transition: 500ms all;
    }
.expndUp {
    margin-bottom: -800px;
    -moz-transition: 500ms all;
    -o-transition: 500ms all;
    -webkit-transition: 500ms all;
    -ms-transition: 500ms all;
    transition: 500ms all;
}
.expndUp:target {
    margin-bottom: 30px;
    -moz-transition: 500ms all;
    -o-transition: 500ms all;
    -webkit-transition: 500ms all;
    -ms-transition: 500ms all;
    transition: 500ms all;
}


/*#endregion expand*/

/*#region -  FLY IN  - */
/* ==========  Fly In  ========== */
.flyInTop {
    position: relative;
    -moz-animation: animflyInTop 800ms;
    -o-animation: animflyInTop 800ms;
    -webkit-animation: animflyInTop 800ms;
    -ms-animation: animflyInTop 800ms;
    animation: animflyInTop 800ms;
}
.flyInRt {
    position: relative;
    -moz-animation: animflyInRt 500ms;
    -o-animation: animflyInRt 500ms;
    -webkit-animation: animflyInRt 500ms;
    -ms-animation: animflyInRt 500ms;
    animation: animflyInRt 500ms;
}
.flyInBtm {
    position: relative;
    -moz-animation: animflyInBtm 800ms;
    -o-animation: animflyInBtm 800ms;
    -webkit-animation: animflyInBtm 800ms;
    -ms-animation: animflyInBtm 800ms;
    animation: animflyInBtm 800ms;
}
.flyInLft {
    position: relative;
    -moz-animation: animflyInLft 500ms;
    -o-animation: animflyInLft 500ms;
    -webkit-animation: animflyInLft 500ms;
    -ms-animation: animflyInLft 500ms;
    animation: animflyInLft 500ms;
}
@-moz-keyframes animflyInTop {
    from {top: -2000px;}
    to {top: 0;}
}
@-o-keyframes animflyInTop {
    from {top: -2000px;}
    to {top: 0;}
}
@-webkit-keyframes animflyInTop {
    from {top: -2000px;}
    to {top: 0;}
}
@-ms-keyframes animflyInTop {
    from {top: -2000px;}
    to {top: 0;}
}
@keyframes animflyInTop {
    from {top: -2000px;}
    to {top: 0;}
}
@-moz-keyframes animflyInRt {
    from {right: -2000px;}
    to {right: 0;}
}
@-o-keyframes animflyInRt {
    from {right: -2000px;}
    to {right: 0;}
}
@-webkit-keyframes animflyInRt {
    from {right: -2000px;}
    to {right: 0;}
}
@-ms-keyframes animflyInRt {
    from {right: -2000px;}
    to {right: 0;}
}
@keyframes animflyInRt {
    from {right: -2000px;}
    to {right: 0;}
}
@-moz-keyframes animflyInBtm {
    from {bottom: -2000px;}
    to {bottom: 0;}
}
@-o-keyframes animflyInBtm {
    from {bottom: -2000px;}
    to {bottom: 0;}
}
@-webkit-keyframes animflyInBtm {
    from {bottom: -2000px;}
    to {bottom: 0;}
}
@-ms-keyframes animflyInBtm {
    from {bottom: -2000px;}
    to {bottom: 0;}
}
@keyframes animflyInBtm {
    from {bottom: -2000px;}
    to {bottom: 0;}
}
@-moz-keyframes animflyInLft {
    from {left: -2000px;}
    to {left: 0;}
}
@-o-keyframes animflyInLft {
    from {left: -2000px;}
    to {left: 0;}
}
@-webkit-keyframes animflyInLft {
    from {left: -2000px;}
    to {left: 0;}
}
@-ms-keyframes animflyInLft {
    from {left: -2000px;}
    to {left: 0;}
}
@keyframes animflyInLft {
    from {left: -2000px;}
    to {left: 0;}
}
/*#endregion - Fly In - */

/*#region -  FADE IN  - */
/* ==========  Fade In  ========== */
.appear {
    -ms-opacity: 1;
    opacity: 1;
    -webkit-transition: opacity 0.15s linear;
    -moz-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    -ms-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}


.fadeIn {
    -ms-opacity: 1;
    opacity: 1;
    -webkit-transition: opacity 0.15s linear;
    -moz-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    -ms-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}
/*#endregion Fade In */

/*#region -  CROSS FADE  - */
/* ==========  Cross Fade  ========== */
.crossFade1Imgs,
.crossFade2Imgs,
.crossFade3Imgs,
.crossFade4Imgs,
.crossFade5Imgs,
.crossFade6Imgs,
.crossFade7Imgs,
.crossFade8Imgs {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

    .crossFade1Imgs figure,
    .crossFade2Imgs figure,
    .crossFade3Imgs figure,
    .crossFade4Imgs figure,
    .crossFade5Imgs figure,
    .crossFade6Imgs figure,
    .crossFade7Imgs figure,
    .crossFade8Imgs figure {
        display: block;
        position: absolute;
        width: 100%;
        top: 0;
        -ms-opacity: 0;
        opacity: 0;
        margin: 0;
        padding: 0;
    }

    .crossFade1Imgs figcaption,
    .crossFade2Imgs figcaption,
    .crossFade3Imgs figcaption,
    .crossFade4Imgs figcaption,
    .crossFade5Imgs figcaption,
    .crossFade6Imgs figcaption,
    .crossFade7Imgs figcaption,
    .crossFade8Imgs figcaption {
        position: absolute;
        bottom: 0;
        color: #fff;
        background: rgba(0,0,0, .45);
        font-size: 1.2em;
        -ms-opacity: 0;
        opacity: 0;
        -webkit-transition: opacity .8s;
        -moz-transition: opacity .8s;
        -ms-transition: opacity .8s;
        -o-transition: opacity .8s;
        transition: opacity .8s;
    }

    .crossFade1Imgs:hover figure figcaption,
    .crossFade2Imgs:hover figure figcaption,
    .crossFade3Imgs:hover figure figcaption,
    .crossFade4Imgs:hover figure figcaption,
    .crossFade5Imgs:hover figure figcaption,
    .crossFade6Imgs:hover figure figcaption,
    .crossFade7Imgs:hover figure figcaption,
    .crossFade8Imgs:hover figure figcaption {
        -ms-opacity: 1;
        opacity: 1;
        -webkit-transition: opacity .8s;
        -moz-transition: opacity .8s;
        -ms-transition: opacity .8s;
        -o-transition: opacity .8s;
        transition: opacity .8s;
    }

    /*--Cross Fade Animation for 1 Images--*/
    .crossFade1Imgs figure:nth-child(1) {
        position: relative;
        -ms-opacity: 1;
        opacity: 1;
        -webkit-transition: all 0.15s linear;
        -moz-transition: all 0.15s linear;
        -o-transition: all 0.15s linear;
        -ms-transition: all 0.15s linear;
        transition: all 0.15s linear;
    }

    /*--Cross Fade Animation for 2 Images--*/
    .crossFade2Imgs figure:nth-child(1) {
        position: relative;
        -moz-animation: crossfade2 14s 0 infinite;
        -o-animation: crossfade2 14s 0 infinite;
        -webkit-animation: crossfade2 14s 0 infinite;
        -ms-animation: crossfade2 14s 0 infinite;
        animation: crossfade2 14s 0 infinite;
    }

    .crossFade2Imgs figure:nth-child(2) {
        -moz-animation: crossfade2 14s 7s infinite;
        -o-animation: crossfade2 14s 7s infinite;
        -webkit-animation: crossfade2 14s 7s infinite;
        -ms-animation: crossfade2 14s 7s infinite;
        animation: crossfade2 14s 7s infinite;
    }


    /*--Cross Fade Animation for 3 Images--*/
    .crossFade3Imgs figure:nth-child(1) {
        position: relative;
        -moz-animation: crossfade3 21s 0s infinite;
        -o-animation: crossfade3 21s 0s infinite;
        -webkit-animation: crossfade3 21s 0s infinite;
        -ms-animation: crossfade3 21s 0s infinite;
        animation: crossfade3 21s 0s infinite;
    }

    .crossFade3Imgs figure:nth-child(2) {
        -moz-animation: crossfade3 21s 7s infinite;
        -o-animation: crossfade3 21s 7s infinite;
        -webkit-animation: crossfade3 21s 7s infinite;
        -ms-animation: crossfade3 21s 7s infinite;
        animation: crossfade3 21s 7s infinite;
    }

    .crossFade3Imgs figure:nth-child(3) {
        -moz-animation: crossfade3 21s 14s infinite;
        -o-animation: crossfade3 21s 14s infinite;
        -webkit-animation: crossfade3 21s 14s infinite;
        -ms-animation: crossfade3 21s 14s infinite;
        animation: crossfade3 21s 14s infinite;
    }



    /*--Cross Fade Animation for 4 Images--*/
    .crossFade4Imgs figure:nth-child(1) {
        position: relative;
        -moz-animation: crossfade4 28s 0s infinite;
        -o-animation: crossfade4 28s 0s infinite;
        -webkit-animation: crossfade4 28s 0s infinite;
        -ms-animation: crossfade4 28s 0s infinite;
        animation: crossfade4 28s 0s infinite;
    }

    .crossFade4Imgs figure:nth-child(2) {
        -moz-animation: crossfade4 28s 7s infinite;
        -o-animation: crossfade4 28s 7s infinite;
        -webkit-animation: crossfade4 28s 7s infinite;
        -ms-animation: crossfade4 28s 7s infinite;
        animation: crossfade4 28s 7s infinite;
    }

    .crossFade4Imgs figure:nth-child(3) {
        -moz-animation: crossfade4 28s 14s infinite;
        -o-animation: crossfade4 28s 14s infinite;
        -webkit-animation: crossfade4 28s 14s infinite;
        -ms-animation: crossfade4 28s 14s infinite;
        animation: crossfade4 28s 14s infinite;
    }

    .crossFade4Imgs figure:nth-child(4) {
        -moz-animation: crossfade4 28s 21s infinite;
        -o-animation: crossfade4 28s 21s infinite;
        -webkit-animation: crossfade4 28s 21s infinite;
        -ms-animation: crossfade4 28s 21s infinite;
        animation: crossfade4 28s 21s infinite;
    }


    /*--Cross Fade Animation for 5 Images--*/
    .crossFade5Imgs figure:nth-child(1) {
        position: relative;
        -moz-animation: crossfade5 35s 0s infinite;
        -o-animation: crossfade5 35s 0s infinite;
        -webkit-animation: crossfade5 35s 0s infinite;
        -ms-animation: crossfade5 35s 0s infinite;
        animation: crossfade5 35s 0s infinite;
    }

    .crossFade5Imgs figure:nth-child(2) {
        -moz-animation: crossfade5 35s 7s infinite;
        -o-animation: crossfade5 35s 7s infinite;
        -webkit-animation: crossfade5 35s 7s infinite;
        -ms-animation: crossfade5 35s 7s infinite;
        animation: crossfade5 35s 7s infinite;
    }

    .crossFade5Imgs figure:nth-child(3) {
        -moz-animation: crossfade5 35s 14s infinite;
        -o-animation: crossfade5 35s 14s infinite;
        -webkit-animation: crossfade5 35s 14s infinite;
        -ms-animation: crossfade5 35s 14s infinite;
        animation: crossfade5 35s 14s infinite;
    }

    .crossFade5Imgs figure:nth-child(4) {
        -moz-animation: crossfade5 35s 21s infinite;
        -o-animation: crossfade5 35s 21s infinite;
        -webkit-animation: crossfade5 35s 21s infinite;
        -ms-animation: crossfade5 35s 21s infinite;
        animation: crossfade5 35s 21s infinite;
    }

    .crossFade5Imgs figure:nth-child(5) {
        -moz-animation: crossfade5 35s 28s infinite;
        -o-animation: crossfade5 35s 28s infinite;
        -webkit-animation: crossfade5 35s 28s infinite;
        -ms-animation: crossfade5 35s 28s infinite;
        animation: crossfade5 35s 28s infinite;
    }



    /*--Cross Fade Animation for 6 Images--*/
    .crossFade6Imgs figure:nth-child(1) {
        position: relative;
        -moz-animation: crossfade6 36s 0s infinite;
        -o-animation: crossfade6 36s 0s infinite;
        -webkit-animation: crossfade6 36s 0s infinite;
        -ms-animation: crossfade6 36s 0s infinite;
        animation: crossfade6 36s 0s infinite;
    }

    .crossFade6Imgs figure:nth-child(2) {
        -moz-animation: crossfade6 36s 6s infinite;
        -o-animation: crossfade6 36s 6s infinite;
        -webkit-animation: crossfade6 36s 6s infinite;
        -ms-animation: crossfade6 36s 6s infinite;
        animation: crossfade6 36s 6s infinite;
    }

    .crossFade6Imgs figure:nth-child(3) {
        -moz-animation: crossfade6 36s 12s infinite;
        -o-animation: crossfade6 36s 12s infinite;
        -webkit-animation: crossfade6 36s 12s infinite;
        -ms-animation: crossfade6 36s 12s infinite;
        animation: crossfade6 36s 12s infinite;
    }

    .crossFade6Imgs figure:nth-child(4) {
        -moz-animation: crossfade6 36s 18s infinite;
        -o-animation: crossfade6 36s 18s infinite;
        -webkit-animation: crossfade6 36s 18s infinite;
        -ms-animation: crossfade6 36s 18s infinite;
        animation: crossfade6 36s 18s infinite;
    }

    .crossFade6Imgs figure:nth-child(5) {
        -moz-animation: crossfade6 36s 24s infinite;
        -o-animation: crossfade6 36s 24s infinite;
        -webkit-animation: crossfade6 36s 24s infinite;
        -ms-animation: crossfade6 36s 24s infinite;
        animation: crossfade6 36s 24s infinite;
    }

    .crossFade6Imgs figure:nth-child(6) {
        -moz-animation: crossfade6 36s 30s infinite;
        -o-animation: crossfade6 36s 30s infinite;
        -webkit-animation: crossfade6 36s 30s infinite;
        -ms-animation: crossfade6 36s 30s infinite;
        animation: crossfade6 36s 30s infinite;
    }



    /*--Cross Fade Animation for 7 Images--*/
    .crossFade7Imgs figure:nth-child(1) {
        position: relative;
        -moz-animation: crossfade7 35s 0s infinite;
        -o-animation: crossfade7 35s 0s infinite;
        -webkit-animation: crossfade7 35s 0s infinite;
        -ms-animation: crossfade7 35s 0s infinite;
        animation: crossfade7 35s 0s infinite;
    }

    .crossFade7Imgs figure:nth-child(2) {
        -moz-animation: crossfade7 35s 5s infinite;
        -o-animation: crossfade7 35s 5s infinite;
        -webkit-animation: crossfade7 35s 5s infinite;
        -ms-animation: crossfade7 35s 5s infinite;
        animation: crossfade7 35s 5s infinite;
    }

    .crossFade7Imgs figure:nth-child(3) {
        -moz-animation: crossfade7 35s 10s infinite;
        -o-animation: crossfade7 35s 10s infinite;
        -webkit-animation: crossfade7 35s 10s infinite;
        -ms-animation: crossfade7 35s 10s infinite;
        animation: crossfade7 35s 10s infinite;
    }

    .crossFade7Imgs figure:nth-child(4) {
        -moz-animation: crossfade7 35s 15s infinite;
        -o-animation: crossfade7 35s 15s infinite;
        -webkit-animation: crossfade7 35s 15s infinite;
        -ms-animation: crossfade7 35s 15s infinite;
        animation: crossfade7 35s 15s infinite;
    }

    .crossFade7Imgs figure:nth-child(5) {
        -moz-animation: crossfade7 35s 20s infinite;
        -o-animation: crossfade7 35s 20s infinite;
        -webkit-animation: crossfade7 35s 20s infinite;
        -ms-animation: crossfade7 35s 20s infinite;
        animation: crossfade7 35s 20s infinite;
    }

    .crossFade7Imgs figure:nth-child(6) {
        -moz-animation: crossfade7 35s 25s infinite;
        -o-animation: crossfade7 35s 25s infinite;
        -webkit-animation: crossfade7 35s 25s infinite;
        -ms-animation: crossfade7 35s 25s infinite;
        animation: crossfade7 35s 25s infinite;
    }

    .crossFade7Imgs figure:nth-child(7) {
        -moz-animation: crossfade7 35s 30s infinite;
        -o-animation: crossfade7 35s 30s infinite;
        -webkit-animation: crossfade7 35s 30s infinite;
        -ms-animation: crossfade7 35s 30s infinite;
        animation: crossfade7 35s 30s infinite;
    }
    /*--Cross Fade Animation for 8 Images--*/
    .crossFade8Imgs figure:nth-child(1) {
        position: relative;
        -ms-opacity: 1;
        opacity: 1;
        -moz-animation: crossfade8 40s 0s infinite;
        -o-animation: crossfade8 40s 0s infinite;
        -webkit-animation: crossfade8 40s 0s infinite;
        -ms-animation: crossfade8 40s 0s infinite;
        animation: crossfade8 40s 0s infinite;
    }

    .crossFade8Imgs figure:nth-child(2) {
        -moz-animation: crossfade8 40s 5s infinite;
        -o-animation: crossfade8 40s 5s infinite;
        -webkit-animation: crossfade8 40s 5s infinite;
        -ms-animation: crossfade8 40s 5s infinite;
        animation: crossfade8 40s 5s infinite;
    }

    .crossFade8Imgs figure:nth-child(3) {
        -moz-animation: crossfade8 40s 10s infinite;
        -o-animation: crossfade8 40s 10s infinite;
        -webkit-animation: crossfade8 40s 10s infinite;
        -ms-animation: crossfade8 40s 10s infinite;
        animation: crossfade8 40s 10s infinite;
    }

    .crossFade8Imgs figure:nth-child(4) {
        -moz-animation: crossfade8 40s 15s infinite;
        -o-animation: crossfade8 40s 15s infinite;
        -webkit-animation: crossfade8 40s 15s infinite;
        -ms-animation: crossfade8 40s 15s infinite;
        animation: crossfade8 40s 15s infinite;
    }

    .crossFade8Imgs figure:nth-child(5) {
        -moz-animation: crossfade8 40s 20s infinite;
        -o-animation: crossfade8 40s 20s infinite;
        -webkit-animation: crossfade8 40s 20s infinite;
        -ms-animation: crossfade8 40s 20s infinite;
        animation: crossfade8 40s 20s infinite;
    }

    .crossFade8Imgs figure:nth-child(6) {
        -moz-animation: crossfade8 40s 25s infinite;
        -o-animation: crossfade8 40s 25s infinite;
        -webkit-animation: crossfade8 40s 25s infinite;
        -ms-animation: crossfade8 40s 25s infinite;
        animation: crossfade8 40s 25s infinite;
    }

    .crossFade8Imgs figure:nth-child(7) {
        -moz-animation: crossfade8 40s 30s infinite;
        -o-animation: crossfade8 40s 30s infinite;
        -webkit-animation: crossfade8 40s 30s infinite;
        -ms-animation: crossfade8 40s 30s infinite;
        animation: crossfade8 40s 30s infinite;
    }

    .crossFade8Imgs figure:nth-child(8) {
        -moz-animation: crossfade8 40s 35s infinite;
        -o-animation: crossfade8 40s 35s infinite;
        -webkit-animation: crossfade8 40s 35s infinite;
        -ms-animation: crossfade8 40s 35s infinite;
        animation: crossfade8 40s 35s infinite;
    }


@keyframes crossfade2 {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    46% {
        opacity: 1;
    }

    52% {
        opacity: 0;
    }
}

@keyframes crossfade3 {
    0% {
        opacity: 0;
    }

    6% {
        opacity: 1;
    }

    30% {
        opacity: 1;
    }

    34% {
        opacity: 0;
    }
}

@keyframes crossfade4 {
    0% {
        opacity: 0;
    }

    6% {
        opacity: 1;
    }

    22% {
        opacity: 1;
    }

    26% {
        opacity: 0;
    }
}

@keyframes crossfade5 {
    0% {
        opacity: 0;
    }

    6% {
        opacity: 1;
    }

    17% {
        opacity: 1;
    }

    21% {
        opacity: 0;
    }
}

@keyframes crossfade6 {
    0% {
        opacity: 0;
    }

    5% {
        opacity: 1;
    }

    14.6% {
        opacity: 1;
    }

    17.6% {
        opacity: 0;
    }
}

@keyframes crossfade7 {
    0% {
        opacity: 0;
    }

    4% {
        opacity: 1;
    }

    12.3% {
        opacity: 1;
    }

    15.3% {
        opacity: 0;
    }
}

@keyframes crossfade8 {
    0% {
        opacity: 0;
    }

    4% {
        opacity: 1;
    }

    12.3% {
        opacity: 1;
    }

    15.3% {
        opacity: 0;
    }
}

/*#endregion Cross Fade*/

/*#region -  IMAGE SLIDER  - */

/*#endregion image slider*/

/*#region -  DELAY  - */
/* =====  Delay  ===== */
.delay0100 {
    -moz-animation-delay: 100ms;
    -o-animation-delay: 100ms;
    -webkit-animation-delay: 100ms;
    -ms-animation-delay: 100ms;
    animation-delay: 100ms;
}
.delay0200 {
    -moz-animation-delay: 200ms;
    -o-animation-delay: 200ms;
    -webkit-animation-delay: 200ms;
    -ms-animation-delay: 500ms;
    animation-delay: 200ms;
}
.delay0300 {
    -moz-animation-delay: 300ms;
    -o-animation-delay: 300ms;
    -webkit-animation-delay: 300ms;
    -ms-animation-delay: 300ms;
    animation-delay: 300ms;
}
.delay0400 {
    -moz-animation-delay: 400ms;
    -o-animation-delay: 400ms;
    -webkit-animation-delay: 400ms;
    -ms-animation-delay: 400ms;
    animation-delay: 400ms;
}
.delay0500 {
    -moz-animation-delay: 500ms;
    -o-animation-delay: 500ms;
    -webkit-animation-delay: 500ms;
    -ms-animation-delay: 500ms;
    animation-delay: 500ms;
}
.delay0600 {
    -moz-animation-delay: 600ms;
    -o-animation-delay: 600ms;
    -webkit-animation-delay: 600ms;
    -ms-animation-delay: 600ms;
    animation-delay: 600ms;
}
.delay0700 {
    -moz-animation-delay: 700ms;
    -o-animation-delay: 700ms;
    -webkit-animation-delay: 700ms;
    -ms-animation-delay: 700ms;
    animation-delay: 700ms;
}
.delay0800 {
    -moz-animation-delay: 800ms;
    -o-animation-delay: 800ms;
    -webkit-animation-delay: 800ms;
    -ms-animation-delay: 800ms;
    animation-delay: 800ms;
}
.delay0900 {
    -moz-animation-delay: 900ms;
    -o-animation-delay: 900ms;
    -webkit-animation-delay: 900ms;
    -ms-animation-delay: 900ms;
    animation-delay: 900ms;
}
.delay1000 {
    -moz-animation-delay: 1s;
    -o-animation-delay: 1s;
    -webkit-animation-delay: 1s;
    -ms-animation-delay: 1s;
    animation-delay: 1s;
}
.delay1500 {
    -moz-animation-delay: 1.5s;
    -o-animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;
    -ms-animation-delay: 1.5s;
    animation-delay: 1.5s;
}
.delay2000 {
    -moz-animation-delay: 2s;
    -o-animation-delay: 2s;
    -webkit-animation-delay: 2s;
    -ms-animation-delay: 2s;
    animation-delay: 2s;
}
.delay2500 {
    -moz-animation-delay: 2.5s;
    -o-animation-delay: 2.5s;
    -webkit-animation-delay: 2.5s;
    -ms-animation-delay: 2.5s;
    animation-delay: 2.5s;
}
.delay3000 {
    -moz-animation-delay: 3s;
    -o-animation-delay: 3s;
    -webkit-animation-delay: 3s;
    -ms-animation-delay: 3s;
    animation-delay: 3s;
}


/*#endregion - Delay -*/

/*#region -  DURATION  - */
/* ===== Duration ===== */

.duratn0100 {
    -moz-animation-duration: 100ms;
    -o-animation-duration: 100ms;
    -webkit-animation-duration: 100ms;
    -ms-animation-duration: 100ms;
    animation-duration: 100ms;
}
.duratn0200 {
    -moz-animation-duration: 200ms;
    -o-animation-duration: 200ms;
    -webkit-animation-duration: 200ms;
    -ms-animation-duration: 200ms;
    animation-duration: 200ms;
}
.duratn0300 {
    -moz-animation-duration: 300ms;
    -o-animation-duration: 300ms;
    -webkit-animation-duration: 300ms;
    -ms-animation-duration: 300ms;
    animation-duration: 300ms;
}
.duratn0400 {
    -moz-animation-duration: 400ms;
    -o-animation-duration: 400ms;
    -webkit-animation-duration: 400ms;
    -ms-animation-duration: 400ms;
    animation-duration: 400ms;
}
.duratn0500 {
    -moz-animation-duration: 500ms;
    -o-animation-duration: 500ms;
    -webkit-animation-duration: 500ms;
    -ms-animation-duration: 500ms;
    animation-duration: 500ms;
}
.duratn0600 {
    -moz-animation-duration: 600ms;
    -o-animation-duration: 600ms;
    -webkit-animation-duration: 600ms;
    -ms-animation-duration: 600ms;
    animation-duration: 600ms;
}
.duratn0700 {
    -moz-animation-duration: 700ms;
    -o-animation-duration: 700ms;
    -webkit-animation-duration: 700ms;
    -ms-animation-duration: 700ms;
    animation-duration: 700ms;
}
.duratn0800 {
    -moz-animation-duration: 800ms;
    -o-animation-duration: 800ms;
    -webkit-animation-duration: 800ms;
    -ms-animation-duration: 800ms;
    animation-duration: 800ms;
}
.duratn0900 {
    -moz-animation-duration: 900ms;
    -o-animation-duration: 900ms;
    -webkit-animation-duration: 900ms;
    -ms-animation-duration: 900ms;
    animation-duration: 900ms;
}
.duratn1000 {
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    -webkit-animation-duration: 1s;
    -ms-animation-duration: 1s;
    animation-duration: 1s;
}
.duratn1500 {
    -moz-animation-duration: 1.5s;
    -o-animation-duration: 1.5s;
    -webkit-animation-duration: 1.5s;
    -ms-animation-duration: 1.5s;
    animation-duration: 1.5s;
}
.duratn2000 {
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    -webkit-animation-duration: 2s;
    -ms-animation-duration: 2s;
    animation-duration: 2s;
}
.duratn3000 {
    -moz-animation-duration: 3s;
    -o-animation-duration: 3s;
    -webkit-animation-duration: 3s;
    -ms-animation-duration: 3s;
    animation-duration: 3s;
}

.duratn4000 {
    -moz-animation-duration: 4s;
    -o-animation-duration: 4s;
    -webkit-animation-duration: 4s;
    -ms-animation-duration: 4s;
    animation-duration: 4s;
}


/*#endregion - Duration - */

/*#region - Transition - */

.trans0300 {
    -webkit-transition:all 300ms ease-in-out;
    -moz-transition:all 300ms ease-in-out;
    -ms-transition:all 300ms ease-in-out;
    -o-transition:all 300ms ease-in-out;
    transition:all 300ms ease-in-out;
}
.trans0500 {
    -webkit-transition:all 500ms ease-in-out;
    -moz-transition:all 500ms ease-in-out;
    -ms-transition:all 500ms ease-in-out;
    -o-transition:all 500ms ease-in-out;
    transition:all 500ms ease-in-out;
}
.trans0700 {
    -webkit-transition:all 700ms ease-in-out;
    -moz-transition:all 700ms ease-in-out;
    -ms-transition:all 700ms ease-in-out;
    -o-transition:all 700ms ease-in-out;
    transition:all 700ms ease-in-out;
}
.trans1000 {
    -webkit-transition:all 1000ms ease-in-out;
    -moz-transition:all 1000ms ease-in-out;
    -ms-transition:all 1000ms ease-in-out;
    -o-transition:all 1000ms ease-in-out;
    transition:all 1000ms ease-in-out;
}

.trans1300 {
    -webkit-transition:all 1300ms ease-in-out;
    -moz-transition:all 1300ms ease-in-out;
    -ms-transition:all 1300ms ease-in-out;
    -o-transition:all 1300ms ease-in-out;
    transition:all 1300ms ease-in-out;
}

.trans1500 {
    -webkit-transition:all 1500ms ease-in-out;
    -moz-transition:all 1500ms ease-in-out;
    -ms-transition:all 1500ms ease-in-out;
    -o-transition:all 1500ms ease-in-out;
    transition:all 1500ms ease-in-out;
}
.trans1700 {
    -webkit-transition:all 1700ms ease-in-out;
    -moz-transition:all 1700ms ease-in-out;
    -ms-transition:all 1700ms ease-in-out;
    -o-transition:all 1700ms ease-in-out;
    transition:all 1700ms ease-in-out;
}
.trans2000 {
    -webkit-transition:all 2s ease;
    -moz-transition:all 2s ease;
    -ms-transition:all 2s ease;
    -o-transition:all 2s ease;
    transition:all 2000ms ease-in-out;
}
.trans2300 {
    -webkit-transition:all 2300ms ease-in-out;
    -moz-transition:all 2300ms ease-in-out;
    -ms-transition:all 2300ms ease-in-out;
    -o-transition:all 2300ms ease-in-out;
    transition:all 2300ms ease-in-out;
}
.trans2500 {
    -webkit-transition:all 2500ms ease-in-out;
    -moz-transition:all 2500ms ease-in-out;
    -ms-transition:all 2500ms ease-in-out;
    -o-transition:all 2500ms ease-in-out;
    transition:all 2500ms ease-in-out;
}
.trans2700 {
    -webkit-transition:all 2700ms ease-in-out;
    -moz-transition:all 2700ms ease-in-out;
    -ms-transition:all 2700ms ease-in-out;
    -o-transition:all 2700ms ease-in-out;
    transition:all 2700ms ease-in-out;
}
.trans3000 {
    -webkit-transition:all 3000ms ease-in-out;
    -moz-transition:all 3000ms ease-in-out;
    -ms-transition:all 3000ms ease-in-out;
    -o-transition:all 3000ms ease-in-out;
    transition:all 3000ms ease-in-out;
}


/*#endregion */

/*#endregion Animation Effects*/

/*#region -  HOVER  - */
/* ==========  Hover Effects ========== */

/*#region -  OPACITY  - */
/* ==========  Opactiy  ========== */

.hvrOpcty1:hover {
    -ms-opacity: 1;
    opacity: 1;
}
.hvrOpcty0:hover {
    -ms-opacity: 0;
    opacity: 0;
}

/*#endregion */

/*#region -  CARD FLIP  - */
/* ====================  Card Flip  ==================== */

    .hvrCardFlip > .front {
        position: relative;
        top: 0;
        -moz-transform: perspective(800px) rotateY(0);
        -ms-transform: perspective(800px) rotateY(0);
        -o-transform: perspective(800px) rotateY(0);
        -webkit-transform: perspective(800px) rotateY(0);
        transform: perspective(800px) rotateY(0);
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: transform .5s linear 0;
        -moz-transition: transform .5s linear 0;
        -ms-transition: transform .5s linear 0;
        -o-transition: transform .5s linear 0;
        transition: transform .5s linear 0;
    }

    .hvrCardFlip > .back {
        position: absolute;
        top: 0;
        -moz-transform: perspective(800px) rotateY(180deg);
        -ms-transform: perspective(800px) rotateY(180deg);
        -o-transform: perspective(800px) rotateY(180deg);
        -webkit-transform: perspective(800px) rotateY(180deg);
        transform: perspective(800px) rotateY(180deg);
        -moz-backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: transform .5s linear 0;
        -moz-transition: transform .5s linear 0;
        -ms-transition: transform .5s linear 0;
        -o-transition: transform .5s linear 0;
        transition: transform .5s linear 0;
    }

    .hvrCardFlip:hover .front {
        -moz-transform: perspective(800px) rotateY(-180deg);
        -ms-transform: perspective(800px) rotateY(-180deg);
        -o-transform: perspective(800px) rotateY(-180deg);
        -webkit-transform: perspective(800px) rotateY(-180deg);
        transform: perspective(800px) rotateY(-180deg);
        cursor: pointer;
    }

    .hvrCardFlip:hover .back {
        -moz-transform: perspective(800px) rotateY(0);
        -ms-transform: perspective(800px) rotateY(0);
        -o-transform: perspective(800px) rotateY(0);
        -webkit-transform: perspective(800px) rotateY(0);
        transform: perspective(800px) rotateY(0);
        cursor: pointer;
    }


/*#region -  Card Caption  - */


/*#endregion Card Caption  - */


/*#region  - CARD EXPAND - */
/*.hvrExpndrStatic {
    display: block;
    width: 100%;
    position: relative;
    background: #777;
    margin: .2em 0;
}

div.hvrExpndrStatic :first-child {
    color: burlywood;
}

.hvrExpndrDynamic {
    display: block;
    width: 100%;
    height: 0;
    overflow: hidden;
    position: relative;
    background: #fff;
    padding: 0;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all 500ms ease;
    transition: all .3s ease;
}

.hvrExpndrStatic:hover .hvrExpndrDynamic:hover {
    height: auto;
    xmin-height: 150px;
    padding: 2em 0;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}


.rowHvrOpen {
    width: 100%;
    height: auto;
    max-height: 2.35em;
    display: block;
    background: coral;
    border: 1px solid red;
    transition: all 600ms;
}

.rowHvrOpen:hover {
    width: 100%;
    height: auto;
    max-height: 1000px;
}

#RowClckOpen {
    width: 100%;
    height: auto;
    max-height: 2.35em;
    display: block;
    background: coral;
    border: 1px solid red;
    transition: all 600ms;
}

#RowClckOpen:target {
    max-height: 1000px;
}*/


/*.accordion {
    xxwidth: 100%;
    display: block;
    position: relative;
        top: 0;
    bottom:0;

    margin: 0 auto;
    padding: 0;
}


.accordion .static {
    height: auto;
    background: red;
}

.accordion .dynamic {
    height: auto;
    max-height: 0px;
    visibility: hidden;
    background: blue;
}
.accordion .dynamic:target {
    max-height: 1000px;
    visibility: visible;
    position: relative;
    top: 0;
    bottom:0;
}

.accordion .static:hover .dynamic:hover {
    visibility: visible;
    max-height: 1000px;
    background: none;
}*/




 /*div:nth-child(n+3):hover .rowHvrXpndr{
    max-height: 1000px;
}
*/



.hvrXpndr {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: pointer;
    background: coral;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #aaa;
    margin: 0;
    padding: 0;

}

   .hvrXpndr > :first-child {
        display: block;
        position: relative;
        cursor: pointer;
        width: 100%;
        background: #ccc;
        margin: 0;
        padding: .9em 1.5em;
    }
    .hvrXpndr > :first-child:before {
        content: " \25BC  ";
        color: green;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: left;
    }
    .hvrXpndr:hover > :first-child:before {
        content: " \25B2  ";
        color: red;
        -ms-text-shadow: 4px 4px 4px #ccc;
        text-shadow: 4px 4px 4px #ccc;
        text-align: right;
    }

.hvrXpndr > :nth-child(1n+2), .hvrXpndr> :nth-child(1n+2)  {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 0;
    overflow: hidden;
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    color: blue;
    -webkit-transition: all .05s linear, max-height .1s ease;
    -moz-transition: all .05s linear, max-height .1s ease;
    -ms-transition: all .05s linear, max-height .1s ease;
    -o-transition: all .05s linear, max-height .1s ease;
    transition: all .05s linear, max-height .1s ease;
}

.hvrXpndr:hover > :first-child, .hvrXpndr:focus > :first-child {
    -webkit-box-shadow: 0px 3px 15px #666;
    -ms-box-shadow: 0px 3px 15px #666;
    box-shadow: 0px 3px 15px #666;
}



.hvrXpndr:focus  > :nth-child(1n+2), .hvrXpndr:hover > :nth-child(1n+2), .hvrXpndr  > :nth-child(1n+2):focus {
    max-height: 1000px;
    padding-top: .7em;
    padding-bottom: .7em;
    -webkit-transition: all .05s linear, max-height .85s ease-in-out;
    -moz-transition: all .05s linear, max-height .85s ease-in-out;
    -ms-transition: all .05s linear, max-height .85s ease-in-out;
    -o-transition: all .05s linear, max-height .85s ease-in-out;
    transition: all .05s linear, max-height .85s ease-in-out;
}



/*#endregion */

/*#endregion Card Flip*/

/*#region -  LIFT  - */
/* ==========  Lift  ========== */
 div.wrp  ~ .hvrShdwLift {
    padding-top: 30px;
    padding-bottom: 130px;
}

.hvrShdwLift:hover {
    -moz-transform: scale(1.10);
    -ms-transform: scale(1.10);
    -o-transform: scale(1.10);
    -webkit-transform: scale(1.10);
    transform: scale(1.10);
    z-index: 900;
    -webkit-box-shadow: 20px 30px 30px -3px rgba(222, 222, 222, 015);
    -ms-box-shadow: 20px 30px 30px -3px rgba(222, 222, 222, 015);
    box-shadow: 20px 30px 30px -3px rgba(222, 222, 222, 015);
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

/*#endregion hover Lift*/

/*#region -  ROTATE - */
/* ====================  Rotate  ==================== */

.hvrRotate005:hover {
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
    z-index: 900;
}
.hvrRotate010:hover {
    -moz-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
    z-index: 900;
}
.hvrRotate015:hover {
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
    z-index: 900;
}
.hvrRotate020:hover {
    -moz-transform: rotate(20deg) !important;
    -ms-transform: rotate(20deg) !important;
    -o-transform: rotate(20deg) !important;
    -webkit-transform: rotate(20deg) !important;
    transform: rotate(20deg) !important;
    z-index: 900;
}
.hvrRotate030:hover {
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
    z-index: 900;
}
.hvrRotate035:hover {
    -moz-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    -o-transform: rotate(35deg);
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
    z-index: 900;
}
.hvrRotate040:hover {
    -moz-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -webkit-transform: rotate(40deg);
    transform: rotate(40deg);
    z-index: 900;
}
.hvrRotate045:hover {
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 900;
}
.hvrRotate050:hover {
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    -webkit-transform: rotate(50deg);
    transform: rotate(50deg);
    z-index: 900;
}
.hvrRotate060:hover {
    -moz-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    z-index: 900;
}
.hvrRotate070:hover {
    -moz-transform: rotate(70deg);
    -ms-transform: rotate(70deg);
    -o-transform: rotate(70deg);
    -webkit-transform: rotate(70deg);
    transform: rotate(70deg);
    z-index: 900;
}
.hvrRotate080:hover {
    -moz-transform: rotate(80deg);
    -ms-transform: rotate(80deg);
    -o-transform: rotate(80deg);
    -webkit-transform: rotate(80deg);
    transform: rotate(80deg);
    z-index: 900;
}
.hvrRotate090:hover {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    z-index: 900;
}
.hvrRotate100:hover {
    -moz-transform: rotate(100deg);
    -ms-transform: rotate(100deg);
    -o-transform: rotate(100deg);
    -webkit-transform: rotate(100deg);
    transform: rotate(100deg);
    z-index: 900;
}
.hvrRotate180:hover {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    z-index: 900;
}
.hvrRotate270:hover {
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
    z-index: 900;
}
.hvrRotate360:hover {
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    z-index: 900;
}

/*#endregion hover rotate*/

/*#region -  SCALE  - */
/* ==========  Scale  ========== */
.hvrScale050:hover  { 
    -moz-transform: scale(0.50);
    -ms-transform: scale(0.50);
    -o-transform: scale(0.50);
    -webkit-transform: scale(0.50);
    transform: scale(0.50);
}
.hvrScale060:hover  { 
    -moz-transform: scale(0.60);
    -ms-transform: scale(0.60);
    -o-transform: scale(0.60);
    -webkit-transform: scale(0.60);
    transform: scale(0.60);
}
.hvrScale070:hover  { 
    -moz-transform: scale(0.70);
    -ms-transform: scale(0.70);
    -o-transform: scale(0.70);
    -webkit-transform: scale(0.70);
    transform: scale(0.70);
}
.hvrScale080:hover  { 
    -moz-transform: scale(0.80);
    -ms-transform: scale(0.80);
    -o-transform: scale(0.80);
    -webkit-transform: scale(0.80);
    transform: scale(0.80);
}
.hvrScale090:hover  { 
    -moz-transform: scale(0.90);
    -ms-transform: scale(0.90);
    -o-transform: scale(0.90);
    -webkit-transform: scale(0.90);
    transform: scale(0.90);
}

.hvrScale095:hover  { 
    -moz-transform: scale(0.95);
    -ms-transform: scale(0.95);
    -o-transform: scale(0.95);
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
}
.hvrScale105:hover  {
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    z-index: 900;
}

.hvrScale110:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    z-index: 900;
}
.hvrScale120:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    z-index: 900;
}
.hvrScale130:hover {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    z-index: 900;
}
.hvrScale140:hover {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
    z-index: 900;
}
.hvrScale150:hover {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    z-index: 900;
}
.hvrScale160:hover {
    -webkit-transform: scale(1.6);
    -moz-transform: scale(1.6);
    -ms-transform: scale(1.6);
    -o-transform: scale(1.6);
    transform: scale(1.6);
    z-index: 900;
}
.hvrScale170:hover {
    -webkit-transform: scale(1.7);
    -moz-transform: scale(1.7);
    -ms-transform: scale(1.7);
    -o-transform: scale(1.7);
    transform: scale(1.7);
    z-index: 900;
}
.hvrScale180:hover {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
    z-index: 900;
}
.hvrScale190:hover {
    -webkit-transform: scale(1.9);
    -moz-transform: scale(1.9);
    -ms-transform: scale(1.9);
    -o-transform: scale(1.9);
    transform: scale(1.9);
    z-index: 900;
}
.hvrScale200:hover {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
    z-index: 900;
}

/*#endregion hover scale*/

/*#region -  SHADOW  - */
/*  ========= Shadow  =========  */

.hvrShdw0:hover {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}
.hvrShdw2:hover {
    -moz-box-shadow: 2px 2px 2px 2px #ccc;
    -webkit-box-shadow: 2px 2px 2px 2px #ccc;
    -ms-box-shadow: 2px 2px 2px 2px #ccc;
    box-shadow: 2px 2px 2px 2px #ccc;
}
.hvrShdw4:hover {
    -moz-box-shadow: 2px 2px 4px 2px #727272;
    -webkit-box-shadow: 2px 2px 4px 2px #727272;
    -ms-box-shadow: 2px 2px 4px 2px #727272;
    box-shadow: 2px 2px 4px 2px #727272;
}
.hvrShdw6:hover {
    -webkit-box-shadow: 2px 2px 6px 2px #595D61;
    -ms-box-shadow: 2px 2px 6px 2px #595D61;
    -moz-box-shadow: 2px 2px 6px 2px #595D61;
    box-shadow: 2px 2px 6px 2px #595D61;
}
.hvrShdw8:hover {
    -moz-box-shadow: 3px 3px 8px 3px #333;
    -webkit-box-shadow: 3px 3px 8px 3px #333;
    -ms-box-shadow: 3px 3px 8px 3px #333;
    box-shadow: 3px 3px 8px 3px #333;
}
.hvrShdwIn4:hover {
    -moz-box-shadow: Inset 2px 2px 4px 2px #333;
    -webkit-box-shadow: Inset 2px 2px 4px 2px #333;
    -ms-box-shadow: Inset 2px 2px 4px 2px #333;
    box-shadow: Inset 2px 2px 4px 2px #333;
}

/*#endregion hover shadow*/

/*#endregion Hover Effects*/

/*#region -  COLOR PICKER  - */
#ColorPicker {
    width: 300px;
    height: 300px;
    margin: 120px 0 0 -55px;
    padding: 0;
    cursor: crosshair;
}

#ColorSlider {
    width: 50px;
    height: 300px;
    margin: -120px 0 0 70px;
    padding: 0;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    cursor: crosshair;
}
/*#endregion color picker */
